<!--
 * @Description: 变更单详情
 * 
 * @Author: XiongYaoYuan<xiongyaoyuan>
 * @Date: 2023-07-19 18:24:17
 * @FilePath: /yuxiuproweb/src/views/split/order/mods/detail.vue
-->
<template>
  <el-drawer title="变更单详情" size="100%" :visible.sync="shows">
    <div class="detail">
      <CustomView
        v-if="customCurtain.length"
        :list="customCurtain"
        :info="info"
      />
      <DecorateView
        v-if="customWindowCurtain.length"
        :list="customWindowCurtain"
        :info="info"
      />
      <OtherView v-if="customOther.length" :list="customOther" :info="info" />
      <RawView v-if="raw.length" :list="raw" :info="info" />
    </div>
    <div
      v-if="info && info.state === '0'"
      style="margin: 30px; display: flex; justify-content: right"
    >
      <el-button type="success" @click="handleExamine">审 核</el-button>
    </div>
  </el-drawer>
</template>

<script>
import { getProOrder, updateProOrder } from "@/api/asc/order";
import CustomView from "./cell/custom.vue";
import DecorateView from "./cell/decorate.vue";
import OtherView from "./cell/other.vue";
import RawView from "./cell/raw.vue";
export default {
  components: {
    CustomView,
    DecorateView,
    OtherView,
    RawView,
  },
  props: {
    show: Boolean,
    data: {
      type: Object,
    },
  },
  data() {
    return {
      customCurtain: [],
      customWindowCurtain: [],
      customOther: [],
      raw: [],
      info: null,
    };
  },
  computed: {
    shows: {
      get() {
        return this.show;
      },
      set(newValue) {
        this.$emit("update:show", newValue);
        if (!newValue) {
          this.$emit("update");
        }
      },
    },
  },
  created() {
    this.getProOrder();
  },
  methods: {
    getProOrder() {
      getProOrder(this.data.variationOrderId).then(({ data }) => {
        this.info = data;
        this.customCurtain = JSON.parse(data.customCurtain);
        this.customWindowCurtain = JSON.parse(data.customWindowCurtain);
        this.customOther = JSON.parse(data.customOther);
        this.raw = JSON.parse(data.raw);
      });
    },
    handleExamine() {
      this.$confirm("是否确定审核？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          updateProOrder({
            ...this.info,
            state: "1",
          }).then(() => {
            this.getProOrder();
          });
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="scss" scoped>
.detail {
  padding: 0 20px 40px 20px;
}
</style>
